Cоздание каталога товаров с помощью PHP, MySQL и jQuery 2017 Урок 0. Введение. Создание каталога товаров: Представляем Вашему вниманию курс по созданию каталога товаров с помощью PHP, MySQL и jQuery. Это огромный по объему курс, в котором не просто решается какая-то конкретная задача, но в котором практически в режиме онлайн мы будем создавать собственный движок с нуля. Написанный в курсе по созданию каталога товаров с помощью PHP, MySQL и jQuery движок, можно будет использовать как для каталога, так и для любого другого сайта: визитка, интернет-магазин, корпоративный сайт, блог. Изначально курс задумывался небольшим, на несколько уроков, но, поскольку курс пришелся по душе многим пользователями, было решено значительно расширить объем предлагаемого в курсе материала. Собственно, львиная доля материалов курса по созданию каталога товаров с помощью PHP, MySQL и jQuery была создана в форме ответов на вопросы от подписчиков на данный курс. Вот лишь некоторая часть вопросов и задач, на которые Вы сможете найти здесь ответы: меню категорий с неограниченным уровнем вложенности, хлебные крошки, ЧПУ, роутинг, создание системы комментариев, авторизация и регистрация, поиск, живой поиск и многое-многое другое. Видеокурс "Создание каталога товаров на PHP, MySQL", с нуля. В итоге вы научитесь создавать не простые каталоги на PHP, коими пестрят многие обучающие проекты, а довольной сложный и современный, но при этом применимый к любому вашему будущему проекту. Урок 1. Вывод категорий: От автора: совсем недавно мне пришлось переписывать движок для одного из сайтов. При этом передо мной встала задача реализации полноценного каталога товаров. В этой серии уроков я бы хотел поделиться с Вами в общих чертах своим решением. При этом данный каталог можно считать вполне готовым продуктом для использования на собственном сайте. К тому же, каталог будет обладать всеми теми «плюшками», которые зачастую и присущи любому каталогу продуктов. Урок 2. Хлебные крошки: От автора: в этом уроке мы продолжим с вами создание каталога товаров и займемся созданием так называемых хлебных крошек. Хлебные крошки – это навигационная цепочка, представляющая собой путь от текущего элемента до «корня». Это весьма полезная вещь, как для рядового пользователя, так и для поисковиков. Благодаря подобной навигации пользователь не потеряется на сайте и всегда будет знать, к какой категории относится просматриваемый в данный момент товар. Также он всегда сможет перейти к нужной категории из навигационной цепочки. Ну а для поисковиков хлебные крошки представляют ценность, поскольку навигация предоставляет возможность дополнительной перелинковки. Урок 3. Вывод товаров: От автора: в предыдущих двух уроках мы с вами вывели меню каталога и реализовали хлебные крошки для категорий. Теперь пришло время выводить продукты той категории, к которой обратился пользователь. На самом деле эта задача, пожалуй, может оказаться даже посложнее двух предыдущих, но, полагаю, мы с вами справимся. Урок 4. Постраничная навигация. Часть 1: От автора: в предыдущем уроке мы с вами реализовали вывод всех товаров каталога или вывод товаров запрошенной категории. Однако, если товаров слишком много, то наша страница будет просто громадной. Согласитесь, сложно уместить на одной странице сотни товаров. А если товаров тысячи? В этом уроке мы с вами начнем создавать функцию постраничной навигации (пагинации), которая ограничивает вывод товаров на страницу строго ограниченным количеством. Саму функцию постраничной навигации мы реализуем в следующем уроке, а в этом — подготовим все необходимые для нее данные. Урок 5. Постраничная навигация. Часть 2: От автора: в предыдущем уроке мы с вами подготовили все необходимые данные для создания функции постраничной навигации. Теперь мы можем смело приступать к написанию этой функции и последующему стилевому оформлению полученной пагинации. Как уже отмечалось ранее, постраничная навигация может иметь различный вид в зависимости от потребностей сайта. Урок 6. Просмотр товара: От автора: в этом уроке мы реализуем просмотр карточки товара. Сделать это на самом деле довольно просто — у нас есть ID товара, по которому мы можем получить все необходимые данные по запросу. Однако, определенную сложность может представлять добавление товара в хлебные крошки с сохранением там всей цепочки категорий. Но в действительности эта задача не такая уж и сложная, нам даже не придется изменять функцию построения хлебных крошек. Урок 7. Выбор количества товаров: От автора: одним из элементов юзабилити в каталоге товаров является список количества выводимых на страницу товаров. Чаще всего это обычный выпадающий список, в котором представлены на выбор несколько значений и, выбрав одно из них, пользователь увидит новое количество товаров на странице. При этом изменения будут запомнены, и на других страницах пользователь также будет видеть выбранное количество. Урок 8. ЧПУ: От автора: в этом уроке мы с вами приступим к реализации ЧПУ – человекопонятных урлов. В течение нескольких уроков мы попробуем реализовать несколько вариантов ЧПУ и рассмотрим несколько способов их реализации. Урок 9. ЧПУ. Вариант 2: От автора: в предыдущем уроке нами были реализованы ЧПУ, которые позволяли обращаться к товарам и категориям по их номерам (ID). Да, мы исключили явные GET-параметры в адресах, заменив их на нужный нам вид, однако, от этого данные адреса вряд ли стали более понятными для человека. В этом уроке мы займемся реализацией второго варианта ЧПУ. Это будут действительно понятные человеку адреса, где вместо номеров будут присутствовать названия (т.н. алиасы) товаров транслитом. Урок 10. ЧПУ. Роутинг: От автора: в этом уроке мы с вами рассмотрим еще один вариант создания ЧПУ. Здесь мы уже будем по минимуму использовать возможности модуля mod_rewrite. Для нового варианта ЧПУ мы напишем функцию роутинга (еще ее часто называют функцией маршрутизации), которая будет анализировать поступивший адрес URL и отдавать соответствующие данные. Урок 11. Контроль ошибок: От автора: данный урок несколько отличается по содержанию от предыдущих. Здесь мы не будем создавать новый функционал, в этом уроке мы постараемся дать ответ на те вопросы, которые вы задаете при использовании уже имеющегося функционала. Буквально пару дней тому на нашем форуме был задан вопрос о возникновении нескольких ошибок, связанных с использованием каталога. Давайте разберемся, что это за ошибки и рассмотрим способы их устранения. Урок 12. MVC: От автора: в этом уроке мы изменим структуру нашего приложения, отделив друг от друга его составляющие: модели, контроллеры и виды, т.е. наше приложение целиком и полностью будет соответствовать шаблону проектирования MVC. Для чего мы это делаем? Зачем изменять структуру приложения? Дело в том, что на форуме был задан вопрос, как добавить в каталог ссылки на страницы никак не связанные с самим каталогом. Иными словами нужно не каталог подключать к существующему сайту, а наоборот, — каталог и должен стать ядром будущего сайта, к которому можно подключать дополнительный функционал: страницы, статьи и т.д. Урок 13. Меню страниц: От автора: как и договаривались, этот урок мы посвятим тому, что добавим к каталогу функционал, не связанный напрямую с каталогом товаров, а именно, добавим меню страниц. Благодаря разделению компонентов (модель, вид, контроллер), которое мы реализовали на прошлом уроке, добавление меню страниц и получение запрошенной страницы станут несложной процедурой. Урок 14. Альтернативное меню категорий: От автора: недавно на форуме поступил вопрос о том, как создать альтернативное меню категорий для каждого конкретного раздела. Что это значит? Например, у нас есть 3 корневые категории: Категория 1, Категория 2 и Категория 3. У каждой из них есть свои подкатегории. Задача заключается в том, чтобы вывести еще одно меню, в котором будут только указанные корневые категории и при клике на любую из них мы бы видели не полный аккордеон всех категорий, а только выбранную категорию с ее подкатегориями. Урок 15. Комментарии. Часть 1: От автора: этим уроком мы начнем создание отзывов или комментариев для наших товаров. Что должна уметь создаваемая система комментариев? Собственно, идеи для требуемого функционала мы возьмем из ваших предложений уроков. Комментарии должны поддерживать вложенность, комментарии администрации сайта должны выделяться из прочих комментариев. Также комментарии должны поддерживать модерацию. Это тот минимум функционала, который мы реализуем. Урок 16. Комментарии. Часть 2: От автора: в предыдущем уроке мы создали таблицу для хранения комментариев к товарам и вывели комментарии на сайт. При этом комментарии уже поддерживают вложенность. В этом уроке мы создадим форму для добавления комментариев и подготовим все для асинхронного добавления комментариев, т.е. для добавления комментариев без перезагрузки страницы. Урок 17. Комментарии. Часть 3: От автора: в предыдущем уроке мы получили все необходимые данные для их отправки на сервер. В этом уроке мы будем отправлять сформированные данные на сервер асинхронно ajax-запросом. Также мы напишем функции, которая будет принимать данные и добавлять комментарий в базу данных. Урок 18. Комментарии. Часть 4: От автора: в предыдущем уроке мы написали функцию в модели, которая добавляет комментарий в базу данных. Однако сам комментарий появляется на странице пока что лишь после обновления самой страницы. А хотелось бы, чтобы пользователь сразу увидел свой комментарий и при этом увидел его в нужном месте структуры комментариев. Урок 19. Комментарии. Часть 5: От автора: в предыдущем уроке мы реализовали асинхронный вывод добавленного комментария в структуру комментариев. Комментарий занимает положенное ему место. Однако, сейчас добавление комментария происходит как-то незаметно. Давайте исправим этот момент, добавив симпатичный эффект при выводе комментария, а также в момент его добавления. Урок 20. Исправляем ошибки: От автора: в этом небольшом уроке мы займемся исправлением ошибок в структуре нашего приложения. Строго говоря, на самом деле мы будем исправлять, конечно же, не ошибки, поскольку наше приложение отлично работает. На самом деле мы изменим некие вещи в структуре каталога, которые принято писать несколько иначе. Урок 21. Авторизация. Часть 1: От автора: в этом уроке мы начнем создавать функционал авторизации пользователя. Пока что наша авторизация будет реализована без использования асинхронных запросов, но в последующем мы постараемся добавить к ней функциональности AJAX. Урок 22. Авторизация. Часть 2: От автора: в этом уроке мы завершим реализацию механизма авторизации пользователей на сайте. В частности, мы добавим функционал выхода пользователя с сайта, реализуем различный вид формы комментирования в зависимости от того, авторизован пользователь или нет. А также выделим комментарии от администрации сайта. Урок 23. Восстановление пароля. Часть 1: От автора: в этом уроке мы начнем создавать функционал восстановления пароля. В общем-то, это не столь сложный в реализации функционал, однако, здесь стоит учесть множество нюансов, с тем, чтобы сделать учетную запись пользователя максимально защищенной и не допустить смены пароля не владельцем учетной записи. Урок 24. Восстановление пароля. Часть 2: От автора: в предыдущем урок мы начали тему восстановления пароля, создав форму для ввода email’a регистрации и проверив заполняемость этой формы. В этом уроке мы доработаем функцию forgot модели, добавив еще несколько проверок, и в итоге сформируем секретную ссылку, сохраним ее в БД и отправим на email пользователю. Урок 25. Восстановление пароля. Часть 3: От автора: итак, сейчас по запросу восстановления пароля мы проверяем, есть ли введенный email в нашей базе данных. Если email будет найден, тогда мы формируем уникальную ссылку, которую записываем в таблицу forgot и отправляем эту ссылку на email пользователю. Именно по данной ссылке пользователь сможет изменить себе пароль. При этом срок действия ссылки мы установили в 1 час. Урок 26. Восстановление пароля. Часть 4: От автора: итак, мы произвели все необходимые проверки: проверили, есть ли email в базе данных, корректна ли ссылка, по которой перешел пользователь для смены пароля, не истек ли срок действия ссылки. И теперь мы готовы уже к непосредственной смене пароля. В этом уроке мы напишем функцию, принимающую новый пароль и заменяющую им прежний. Таким образом, этот урок будет финальным в написании функционала восстановления пароля. Урок 27. Регистрация. Часть 1: От автора: в предыдущих уроках мы реализовали функционал авторизации и восстановления пароля. В этом уроке мы начнем писать регистрацию для каталога товаров. Регистрация является довольно обыденным и относительно несложным функционалом. Однако она имеет ряд нюансов, которые обязательно следует учитывать при разработке. Итак, давайте приступим к разработке. Урок 28. Регистрация. Часть 2: От автора: этот урок мы посвятим написанию функции, которая будет проверять уникальность введенных значений в поля логин и email. При этом мы реализуем эту проверку с помощью асинхронного запроса, т.е. без перезагрузки страницы. Без сомнения этот функционал будет плюсом в плане юзабилити для формы регистрации, поскольку пользователь сразу же будет видеть, подходят ли нам введенные данные. Урок 29. Регистрация. Часть 3: От автора: в этом уроке мы приступим уже к непосредственному написанию функции регистрации. Здесь нам не стоит забывать, что, не смотря на проверки уникальности, которые мы написали в прошлом уроке, пользователь все равно может прислать нам логин и / или email, которые нам не подходят. Поэтому в числе прочих проверок мы также должны проверить уникальность логина и email’a, сообщив пользователю, если они нам не подойдут. Урок 30. Регистрация. Часть 4: От автора: итак, мы произвели все необходимые проверки: проверку на заполнение обязательных полей, проверки на уникальность полей логина и email. Теперь все готово для добавления полученных данных в таблицу зарегистрированных пользователей, т.е. для непосредственной регистрации пользователя. Урок 31. Приоритет правил роутинга: От автора: этот урок несколько специфичен и будет отличаться от предыдущих. Здесь мы мало что добавим нового к нашему приложению. Однако, мы закрепим один из изученных моментов, который вызвал некоторые вопросы у вас. Сегодня мы еще раз рассмотрим систему роутинга. Урок 32. Мультитемность: От автора: в этом уроке мы немного изменим структуру нашего приложения для того, чтобы оно поддерживало мультитемность. Все шаблоны для CMS пока хранятся в папке /views/. Но что делать, если мы хотим хранить в этой папке несколько комплектов шаблонов, каждый со своим дизайном. Иными словами, мы хотим хранить в этой папке сколь угодно много тем. Для этого давайте под каждую тему в папке /views/ отведем свою папку. И начнем мы с текущей темы, которую поместим в отдельную папку. Урок 33. Создание темы. Часть 1: От автора: в этом уроке мы приступим к созданию новой темы из имеющихся в нашем распоряжении шаблонов. Собственно, процесс создания темы должен быть довольно простым и сводится к тому, чтобы в нужных местах шаблона статические части заменить динамическими. В этом уроке мы перенесем шаблон в папку с новой темой в том виде, как он есть, а затем динамически выведем меню категорий и меню страниц. Урок 34. Создание темы. Часть 2: От автора: в этом уроке мы продолжим создание новой темы: в частности, выведем хлебные крошки, товары выбранной категории или всего каталога в целом, а также постраничную навигацию для каталога. Урок 35. Создание темы. Часть 3: От автора: в прошлом уроке мы фактически закончили перенос главного шаблона в новую тему. В этом уроке мы займемся шаблонами страницы и карточки продукта. Также в уроке мы поработаем с меню, добившись того, чтобы пункт активной страницы был выделен в меню. Урок 36. Алиасы для ЧПУ категорий: От автора: в этом уроке мы с вами вернемся к теме ЧПУ, в частности ЧПУ для ссылок категорий. Как вы помните, сейчас мы в этих ссылках используем идентификаторы категорий. В то же время для продуктов используются их алиасы, что, безусловно, делает более понятным содержание ссылок. Давайте попробуем исправить этот момент и заменить идентификаторы в ссылках категорий на алиасы. Урок 37. Создание темы. Часть 4: От автора: в этом уроке мы продолжим создание новой темы для каталога товаров. В частности, этот урок будет посвящен формам авторизации и восстановления пароля. Урок 38. Отвечаем на вопросы. Часть 1: От автора: данный урок будет носить специфичный характер, поскольку здесь мы фактически не будем создавать новый запланированный функционал. В этом уроке я попробую ответить и прокомментировать те вопросы, которые вы задаете на нашем форуме (http://webformyself.com/forum/) и канале YouTube (http://www.youtube.com/user/webformyself). Урок 39. Отвечаем на вопросы. Часть 2: От автора: в этом уроке мы продолжаем отвечать на все те вопросы, которые вы задаете на нашем форуме и канале YouTube. Урок 40. Поиск. Часть 1: От автора: в этом уроке мы приступим к созданию функционала, отвечающего за поиск на сайте. При этом мы в итоге создадим не обычный поиск, а современный, т.н. живой поиск. Все вы его видели на сайтах поисковиков Гугла или Яндекса. Мы начинаем вводить поисковый запрос и нам сразу же предлагается список вариантов, которые могут подойти нам. Достаточно удобная для пользователя вещь. Урок 41. Поиск. Часть 2: От автора: В предыдущем уроке мы прикрутили к поисковому полю виджет Autocomplete библиотеки jQuery UI. Теперь при начале ввода символов в данное поле отправляется запрос на сервер, который пока что возвращает заранее определенный нами ответ. В этом уроке мы будем уже получать конкретный ответ от сервера, который будет соответствовать набираемому запросу. Урок 42. Поиск. Часть 3: От автора: В этом уроке мы закончим реализацию поиска для каталога товаров. Здесь мы напишем необходимые функции модели, позволяющие выбрать товары из базы данных, соответствующие поисковому запросу. При этом наш поиск будет работать как по полному названию товара, так и по части названия. Урок 43. Куки: От автора: После небольшого перерыва мы продолжаем наш курс Каталог товаров. Идею для данного и следующего урока я решил взять из ваших вопросов на нашем форуме. Несколько последних вопросов касались работы с куками. Давайте попробуем осветить данный вопрос на примере работы с нашим приложением. Урок 44. Куки. Запоминаем пользователя: От автора: В предыдущем уроке мы с вами рассмотрели теоретические вопросы работы с куками, моменты безопасности использования кук и еще ряд вопросов. В этом уроке мы от теории перейдем к практике и реализуем запоминание авторизованного пользователя с помощью кук. Урок 45. Создание темы. Регистрация: От автора: В этом уроке мы возвращаемся к вопросу создания темы для нашего движка. Если мне не изменяет память, то у нас пока что не добавлены виды для 2-х функционалов: регистрация и система комментариев. В этом уроке мы будем заниматься созданием вида регистрации. Урок 46. Валидация: От автора: В этом уроке мы решим несколько задач, связанных с функционалом регистрации. В частности, мы добавим подтверждение пароля при регистрации, а также добавим валидацию email. Также мы расширим возвращаемый пользователю ответ об ошибке. Сейчас, в случае ошибки, мы рядом с полем выводим иконку крестика, которая не подскажет пользователю, чем конкретно не подходит логин или email. В этом уроке мы исправим этот недочет, выводя текстовое сообщение об ошибке. Урок 47. Капча. Часть 1: От автора: В этом и следующем уроке мы реализуем классический вариант капчи для формы регистрации. Что представляет собой классический вариант, полагаю, знаете. Это картинка с шумом, на которой выводится строка, состоящая из нескольких букв и цифр. Именно эту строку пользователь должен прочесть и ввести в соответствующее поле для подтверждения того, что он не бот. Урок 48. Капча. Часть 2: От автора: В этом уроке мы продолжим реализацию классического варианта капчи для формы регистрации. Собственно, простой вариант капчи у нас уже есть. Однако, хотелось бы несколько усложнить чтение капчи: добавить шум к картинке, изменить угол наклона каждого из символов строки капчи, изменить размер каждого символа и т.д. Урок 49. Подсветка результатов поиска: От автора: В этом уроке мы вернемся к поиску и реализуем такую полезную с точки зрения юзабилити возможность, как подсветка поискового запроса в результатах поиска. Думаю, вы уже неоднократно видели подобный функционал. Например, в поисковой выдаче от Гугла и Яндекса слово из поискового запроса выделяется жирным. Урок 50. Поиск по нескольким полям: От автора: в этом уроке мы вернемся к поиску и реализуем такую интересную штуку, как поиск данных по нескольким полям и, главное, вывод данных в выпадающем списке с разбивкой по этим полям. Собственно, данная задача уже практически решена в примерах к виджету Autocomplete на офсайте (http://jqueryui.com/autocomplete/#categories). Там предоставляется уже готовая функция, для которой нам просто необходимо подготовить нужные данные в требуемом формате. Урок 51. Улучшаем портируемость: От автора: в этом уроке мы с вами решим сразу две задачи. Суть первой задачи заключается в улучшении портируемости нашего приложения. Это значит, что теперь изменение домена сайта или перенос его в подпапку не потребует дополнительных настроек приложения или вмешательства в код, приложение будет работать автоматически. Вторая задача заключается в доработке страницы 404 и отправке необходимых для этой страницы заголовков, которые необходимы для поисковиков. По результатам урока мы усовершенствуем наше приложение, улучшив его портируемость, т.е. сделаем его независимым от каталога или доменного имени. Также мы доработаем страницу 404. Урок 52. Структура админской части. Часть 1: От автора: с этого урока мы с вами приступаем к написанию администраторской части. Если вы помните, то начинали мы нашу серию Каталог товаров с идеи создать в нескольких уроках меню категорий с неограниченным уровнем вложенности. Однако в итоге мы уже фактически создаем собственный движок, собственную CMS, которая подойдет не только для каталога товаров, но и для интернет-магазина или блога. По результатам урока мы создадим структуру администраторской части сайта. Урок 53. Структура админской части. Часть 2: От автора: в этом уроке мы с вами продолжаем работать со структурой администраторской части. В частности, мы создадим общие контроллер и модель, которые будут подключаться ко всем прочим контроллерам и использоваться в них. Также мы создадим контроллер авторизации пользователей и необходимый вид, в котором будет находиться форма авторизации. По результатам урока мы создадим структуру администраторской части сайта. Урок 54. Авторизация администратора: От автора: в этом уроке мы с вами реализуем авторизацию администратора в админской части сайта. Для этого мы доработаем необходимые контроллер и модель авторизации, а также учтем несколько нюансов. В частности, мы разрешим авторизовываться администратору как в пользовательской части сайта, так и в администраторской. Пользователи же, по-прежнему, смогут авторизоваться только в пользовательской части. По результатам урока мы реализуем функционал авторизации администратора в админской части сайта. Урок 55. Страница настроек сайта: От автора: в этом уроке мы с вами приступим к реализации главной страницы администраторской части сайта – это будет страница настроек сайта. Сейчас все настройки сайта хранятся преимущественно в файле конфигурации. Это, конечно же, неудобно, поскольку для изменения той или иной настройки нам необходимо лезть в программный код. Создание же в админке страницы опций – значительно упростит нам жизнь и сделает процесс управления сайтом проще и приятнее. По результатам урока мы создадим страницу настроек и выведем на нее имеющиеся у нас настройки сайта. Урок 56. Каталог товаров. Страница настроек. Часть 2: От автора: в этом уроке мы с вами продолжим реализацию главной страницы администраторской части сайта – это будет страница настроек сайта. В частности, в уроке мы создадим универсальный функционал, позволяющий отправлять ajax запрос при редактировании поля таблицы с теми или иными настройками. По результатам урока мы создадим универсальную функцию, позволяющую отправлять асинхронный запрос на изменение тех или иных настроек или других значений в табличных данных. Урок 57. Каталог товаров. Страница настроек. Часть 3: От автора: в этом уроке мы с вами продолжим реализацию главной страницы администраторской части сайта – это будет страница настроек сайта. В частности, мы реализуем функционал сохранения настроек в базе данных, а также добавим переключение тем на сайте из админки. Урок 58. Каталог товаров. Страница настроек. Часть 4: От автора: в этом уроке мы с вами завершим реализацию главной страницы администраторской части сайта – это будет страница настроек сайта. Собственно, эта страница была уже готова в предыдущем уроке — настройки сайта успешно сохраняются в БД. Осталось лишь применить их на сайте. Урок 59. Каталог товаров. Страница списка товаров. Часть 1: От автора: в этом уроке мы приступим к реализации страницы списка товаров. Список товаров будет выводиться в табличном виде, как и список настроек сайта. При этом для каждого товара мы предусмотрим реализацию функции быстрого изменения цены без перезагрузки страницы, как и для настроек сайта. Урок 60. Каталог товаров. Страница списка товаров. Часть 2: От автора: в этом уроке мы продолжим реализацию страницы списка товаров. Здесь мы выведем список всех товаров, а также список товаров запрошенной категории и ее дочерних категорий. Также мы реализуем хлебные крошки, позволяющие перемещаться по дереву категорий, а также начнем реализацию быстрого редактирования цены. Урок 61. Каталог товаров. Быстрое изменение цены: От автора: в этом уроке мы продолжим работу со страницей списка товаров. Список товаров выведен и хотелось бы иметь возможность быстрого изменения цены товара без необходимости редактировать сам товар. В уроке мы реализуем быстрое изменение цены товара без перезагрузки страницы, т.е. используя AJAX. Урок 62. Каталог товаров. Удаление товара: От автора: в этом уроке мы реализуем удаление товара непосредственно со страницы списка товаров, т.е. без необходимости обращаться к странице редактирования товара. Для этого мы напишем универсальную функцию JavaScript, которая позволит удалять не только товар, но и другие элементы сайта из определенного списка: страницы, категории и т.п. Урок 63. Каталог товаров. Редактирование товара. Часть 1: От автора: в этом уроке мы приступим к реализации основной части админки — часть редактирования товара. При реализации редактирования товара мы столкнемся со следующими задачами: выбор категории для товара, загрузка и удаление картинки товара, добавление визуального редактора и др. В этом уроке мы получим данные запрашиваемого товара и выведем его в простейшей пока форме редактирования. Урок 64. Каталог товаров. Редактирование товара. Часть 2: От автора: в этом уроке мы продолжим реализацию функционала редактирования товара. При реализации редактирования товара мы столкнемся со следующими задачами: выбор категории для товара, загрузка и удаление картинки товара, добавление визуального редактора и др. В этом уроке мы встроим визуальный редактор CKEditor к полю описания товара. Урок 65. Каталог товаров. Редактирование товара. Часть 3: От автора: в этом уроке мы продолжим реализацию функционала редактирования товара. При реализации редактирования товара мы столкнемся со следующими задачами: выбор категории для товара, загрузка и удаление картинки товара, добавление визуального редактора и др. В этом уроке мы напишем функцию получения и фильтрации данных из формы. Урок 66. Каталог товаров. Редактирование товара. Часть 4. Алиас товара: От автора: в этом уроке мы продолжим реализацию функционала редактирования товара. Для каждого товара у нас предусмотрено поле alias, которое используется в формировании ЧПУ ссылки на товар. В уроке мы реализуем функцию, которая будет генерировать алиас товара на основе его наименования. При этом алиас будет обязательно уникальным. Урок 67. Каталог товаров. Редактирование товара. Часть 5. KCFinder: От автора: в этом уроке мы продолжим реализацию функционала редактирования товара. Для страницы управления товаром мы прикрутили визуальный редактор CKEditor и теперь можем легко добавлять и оформлять описание товара. Однако, данный редактор не предоставляет функционала загрузки картинок для описания. В уроке мы добавим популярный файловый менеджер KCFinder, с помощью которого можно будет загружать картинки и добавлять их к описанию товара. Урок 68. Каталог товаров. Мета-данные страниц. Часть 1: От автора: в этом уроке мы начнем реализацию функционала добавления мета-данных для любых страниц сайта. Используя данные функции, мы будем иметь возможность как динамически генерировать эти мета-данные, так и прописывать свои собственные. Благодаря этому администратор сможет заполнять title страницы и содержимое мета-тегов description и keywords. Урок 69. Каталог товаров. Мета-данные страниц. Часть 2: От автора: в этом уроке мы завершим реализацию функционала добавления мета-данных для любых страниц сайта. Напомню, используя данные функции, мы будем иметь возможность как динамически генерировать эти мета-данные, так и прописывать свои собственные. Благодаря этому администратор сможет заполнять title страницы и содержимое мета-тегов, что будет иметь некоторый плюс для SEO. Урок 70. Каталог товаров. Загрузка картинок. Часть 1: От автора: в последних двух уроках цикла мы добавим возможность загрузки изображений товаров каталога. Это будет основное изображение товара. Для загрузки файлов мы воспользуемся билиотекой Dropzone.js, благодаря которой загрузка будет выглядеть достойно и современно. В этом уроке мы подключим данную библиотеку и настроим ее для дальнейшей работы. Урок 71. Каталог товаров. Загрузка картинок. Часть 2: От автора: в этом уроке мы завершим реализацию функционала загрузки изображений на сайт. Напомню, что для загрузки файлов мы подключили и настроили библиотеку Dropzone.js. Данная библиотека позволяет загружать картинки на сервер асинхронно, т.е. без перезагрузки страницы. В этом уроке мы займемся серверной частью кода и реализуем обработку и сохранение изображений на сервере.